import React, { Component } from "react";

export default class RenderProps extends Component {
  render() {
    return (
      <div>
        <h3>RenderProps</h3>
        {/* <A>
          <B />
        </A> */}
        <A rander={(name) => <B name={name}></B>}></A>
      </div>
    );
  }
}

class A extends Component {
  state = { name: "hyy" };
  render() {
    return (
      <div>
        <h3>A Components</h3>
        {/* {this.props.children} */}
        {this.props.rander(this.state.name)}
      </div>
    );
  }
}

class B extends Component {
  render() {
    return (
      <div>
        <h3>B Components get name = {this.props.name}</h3>
      </div>
    );
  }
}
